<template>
    <div class="xueshengguanli">
        <div class="top">
            <div class="name">学生管理</div>
            <a href="javascript:;" :class="{'check':ischeck==1}" @click="studentList">学生列表</a>
            <a href="javascript:;" :class="{'check':ischeck==2}" @click="courseClass">课程班级管理</a>
        </div>
        <div class="bottom">
            <router-view></router-view>
        </div>
    </div>
</template>

<script>

export default {
    name:'xueshengguanli',
    components:{
    },
    data() {
        return {
            ischeck:0,

        }
    },
      methods: {
            
            studentList(){
                this.ischeck=1
                this.$router.push('/manage/xueshengguanli/xueshengliebiao')
            },
            courseClass(){
                this.ischeck=2
                this.$router.push('/manage/xueshengguanli/kechengbanjiguanli')
            }
        },
}
</script>

<style lang="scss">
    .xueshengguanli{
        display: flex;
        flex-direction: column;
        width: calc(100vw - 256px);
        .top{
            width: 100%;
            height: 93px;
            background-color: #fff;
            margin-bottom: 10px;
            margin-top: 10px;
            .name{
                height: 68px;
                font-size: 20px;
                padding: 18px;
            }
            a{
                margin-left: 65px;
                padding-bottom: 5px;
                color: #000;
                &.check{
                    color: #1990FE;
                    border-bottom:2px solid #1990FE;
                }
            }
        }
    }
</style>